const lineStyle = ['#FF6060', '#31C3E3', '#206EF2']
const Line1Option = ({ time, datalist, grid }) => {
  let options = {
    tooltip: {
      trigger: 'axis',
    },
    grid: grid
      ? grid
      : {
          top: 20,
          left: 40,
          right: 30,
          bottom: 40,
        },
    xAxis: {
      type: 'category',
      data: time,
      axisPointer: {
        type: 'shadow',
      },
      axisLine: {
        show: false,
      },
      axisTick: {
        show: false,
      },
      splitLine: {
        lineStyle: {
          color: 'rgba(0, 22, 93, 0.1)',
        },
      },
      axisLabel: {
        color: '#8D93A7',
      },
      boundaryGap: false,
    },
    yAxis: [
      {
        type: 'value',
        splitNumber: 3,
        axisLabel: {
          show: true,
          formatter: function (value, index) {
            if (value >= 10000 && value < 10000000) {
              value = value / 10000 + '万'
            } else if (value >= 10000000) {
              value = value / 10000000 + '千万'
            } else if (value <= -10000 && value > -10000000) {
              value = value / 10000 + '万'
            } else if (value <= -10000000) {
              value = value / 10000000 + '千万'
            }
            return value
          },
          color: 'rgba(0, 22, 93, 0.6)',
        },
        axisTick: false,
        axisLine: {
          show: false,
          lineStyle: {
            color: 'rgba(0, 22, 93, 0.4)',
          },
        },
        splitLine: {
          lineStyle: {
            color: '#D4D6E1',
          },
        },
      },
      {
        type: 'value',
        splitNumber: 3,
        axisLabel: {
          // show: false,
          formatter: function (value, index) {
            if (value >= 10000 && value < 10000000) {
              value = value / 10000 + '万'
            } else if (value >= 10000000) {
              value = value / 10000000 + '千万'
            } else if (value <= -10000 && value > -10000000) {
              value = value / 10000 + '万'
            } else if (value <= -10000000) {
              value = value / 10000000 + '千万'
            }
            return value
          },
          color: 'rgba(0, 22, 93, .6)',
        },
        axisTick: false,
        axisLine: {
          show: false,
        },
        splitLine: {
          show: false,
        },
      },
    ],
    series: [
      {
        name: datalist[0].name,
        data: datalist[0].data,
        yAxisIndex: 0,
        type: 'line',
        symbol: 'circle',
        smooth: true,
        symbolSize: 8,
        lineStyle: {
          color: lineStyle[0],
        },
        itemStyle: {
          color: lineStyle[0],
        },
      },
      {
        name: datalist[1].name,
        yAxisIndex: 0,
        data: datalist[1].data,
        type: 'line',
        symbol: 'circle',
        smooth: true,
        symbolSize: 8,
        lineStyle: {
          color: lineStyle[1],
        },
        itemStyle: {
          color: lineStyle[1],
        },
      },
      {
        name: datalist[2].name,
        yAxisIndex: 1,
        data: datalist[2].data,
        type: 'line',
        symbol: 'circle',
        smooth: true,
        symbolSize: 8,
        lineStyle: {
          color: lineStyle[2],
        },
        itemStyle: {
          color: lineStyle[2],
        },
      },
    ],
  }

  return options
}

export { Line1Option }
